<!DOCTYPE html>
<html lang="en">
<head>
    <style>
        #body{
           background-image: url("images/5copy.jpg");
        }
    </style>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css1/style1.css">
    <!-- 2. jQuery导入，建议使用1.9以上的版本 -->
    <script src="js/jquery-3.1.1.min.js"></script>
    <script type="text/javascript">
        // 核心代码实现
		$(function(){
            load();
        });

        //musicName可以传参  也可以不传参数
        function load(title) {
            $.ajax({
                url:"/music/seekMusic",
                data:{"title": title},
                type:"GET",
                dataType:"json",
                success:function(obj) {
                    console.log(obj);
                    var data = obj.data;//数组
                    var s = '';
                    //data[i].id    data[i].singer  data[i].title
                    for(var i = 0; i < data.length;i++) {
                        var musicUrl = data[i].url+".mp3";
                        console.log(musicUrl);
                        s += '<li class="nomargin">';
                        s += '<div class="pic">';
                        s += '<a href="#">';
                        s += '<img src="img/0.png" alt="">';
                        s += '</a>';
                        s += '</div>';
                        s += '<div class="txt">'
                        s += '<h3>' + data[i].title + '</h3>';
                        s += '<p>' + data[i].singer + '</p>';
                        s += '</div>';
                        s += '<a href="#">';
                        s += '<button class = "time"  onclick="playerSong(\''+musicUrl+'\')">播放</button>';
                        s += '</a>';
                        s += '<a href="#">';
                        s += '<button class = "time"  onclick="loveInfo('+data[i].id+')">喜欢</button>';
                        s += '</a>';
                        s += '<a href="#">';
                        s += '<button class = "time"  onclick="deleteInfo('+data[i].id+')">删除</button>';
                         s += '</a>';
                        s += '<input id="'+data[i].id+'" type="checkbox">';
                        s += "</li>"
                    }
                    $("#info").html(s);
                }
            });
        }

        function playerSong(obj) {
            var name = obj.substring(obj.lastIndexOf("=")+1);
            //obj:播放的音乐的地址  name:播放的音乐的名称，0：播放的开始时间  false:不自动播放
            SewisePlayer.toPlay(obj,name,0,true);
        }

        function deleteInfo(obj) {
            console.log(obj);
            $.ajax({
                url:"/music/delete",
                type: "POST",
                data:{"id":obj},
                dataType:"json",

                success: function(val) {
                    console.log(val);

                    if(val.data == true) {
                        //删除成功！
                        alert("删除成功！,重新加载当前页面！");
                        window.location.href = "musiclist.html";
                    }else{
                        alert("删除失败！");
                    }
                }
            });
        }

        function loveInfo(obj) {
            $.ajax({
                url:"/loveMusic/increaseLoveMusic",
                type:"POST",
                data:{"musicId":obj},
                dataType:"json",
                success:function(val){
                    if(val.data == true) {
                        alert("已添加到我喜欢");
                        window.location.href = "musiclist.html";
                    }else{
                        if(val.message == "歌曲以前已添加到我喜欢列表，不能再次添加！") {
                             alert("歌曲以前已添加到我喜欢列表，不能再次添加！");
                        }else {
                             alert("添加到我喜欢失败");
                        }

                    }
                }
            });
        }

        $(function(){
            $("#submit1").click( function(){
                var name = $("#exampleInputName2").val();
                load(name);
            });
            $.when(load).done(function(){
                $("#delete").click(function(){
                    var id = new Array();
                    var i = 0;//数组的小标
                    //
                    $("input:checkbox").each(function(){
                        //如果被选中,this代表发生事件的dom元素，<input>
                        if( $(this).is(":checked")) {
                            id[i] = $(this).attr("id");
                            i++;
                        }
                    });
                    console.log(id);
                    $.ajax({
                        url:"/music/deleteBatch",
                        data:{"id[]":id},
                        dataType:"json",
                        type:"post",

                        success:function(obj){
                            if(obj.data == true) {
                                alert("删除成功！");
                                window.location.href = "musiclist.html";
                            }else{
                                alert("删除失败！");
                            }
                        }
                    });
                });
            });
        });
    </script>
</head>
<html>
<body background="img/1.jpg">
<!-- 头部 -->
<div class="head">
    <div class="head_con">
        <ul class="top_list">
            <li><a id="delete" href="#">删除选中歌曲</a></li>
            <li class="spec">
                <a href="lovemusiclist.html">我喜欢</a>
            </li>
            <li><a href="upload.html">上传歌曲</a></li>
        </ul>

        <div class="head_search">
            <input id="exampleInputName2" type="text" class="sear_input">
            <button id="submit1" type="button">
                <i></i>
            </button>
        </div>
        <div class="head_right">
            <a href="login.html" class="land">登录</a>
        </div>
        <ul class="subnav">

        </ul>
    </div>

</div>

<!-- 新歌首发 -->
<div class="new_song">
    <div class="song_con">
        <h2 class="tit">歌曲列表</h2>
        <div class="tab">

        </div>
        <ul id="info" class="song_list">
            <li class="nomargin">
                <div class="pic">
                    <a href="#"><img src="img/0.png" alt=""></a>
                </div>
                <div class="txt">
                    <h3>QQ炫舞醒狮时尚季主题曲</h3>
                    <p>Yamy郭颖</p>
                </div>
                <button class="time" onclick="playerSong('+musicUrl+')">播放</button>
                <button class="time" onclick="loveInfo('+musicUrl+')">喜欢</button>
                <button class="time" onclick="deleteInfo('+musicUrl+')">删除</button>
                <input id = "1" type="checkbox">
            </li>
          </ul>
    </div>
</div>

<div style="width: 200px; height: 80px; position:absolute; bottom:10px; left:10px">
    <script type="text/javascript" src="player/sewise.player.min.js"></script>
    <script type="text/javascript">
			SewisePlayer.setup({
				server: "vod",
				type: "mp3",
                //这里是默认的一个网址
<!--				videourl:"http://jackzhang1204.github.io/materials/where_did_time_go.mp3",-->
		        skin: "vodFlowPlayer",
                //这里需要设置false
                autostart:"false",
			});
	</script>
</div>
</body>
</html>